<template>
  <div v-if="!typerInitialized">
    <tg-table-basic
      ref="ref-main"
      :max-height="maxHeight"
      :hold-height="holdHeight"
      :table="table"
      :control-bar="controlBar"
      :searcher="searcher"
      :pagination-config="paginationConfig"
    />
    <component
      :is="item.component"
      v-for="(item, index) in components"
      :key="buildDOMKey(item, index)"
      :ref="`ref-sub-${index}`"
      v-bind="item.props"
      v-on="item.events"
    />
  </div>
</template>

<script lang="ts">
/*
prop 列表 [参考 Template]
metaType 列表 [参考 TgTableBasic]
  maxHeight
  holdHeight
  table
  controlBar
  searcher
  paginationConfig
ref 列表
  ref-main [默认]
  ref-sub-${index}
*/
import { Component } from 'vue-property-decorator'
import { ITgTableBasic } from '@TG/interface/types/component'
import Template from './Template'
import TgTableBasic from '@TG/components/TgTable/TgTableBasic.vue'

@Component({
  name: 'TyperListBasic',
  components: {
    TgTableBasic
  }
})
export default class extends Template {
  get maxHeight() {
    return this.getMeta(this, 'maxHeight')
  }

  get holdHeight() {
    return this.getMeta(this, 'holdHeight')
  }

  get table() {
    return this.getMeta(this, 'table')
  }

  get controlBar() {
    return this.getMeta(this, 'controlBar')
  }

  get searcher() {
    const table = this.ref() as ITgTableBasic
    const searcherModel = table.getQuerier()
    const searcher = this.getMeta(this, 'searcher')(searcherModel)
    return Object.assign({}, searcher, {
      props: { model: searcherModel }
    })
  }

  get paginationConfig() {
    return this.getMeta(this, 'paginationConfig')
  }

  public initTemplate() {
    super.initTemplate()
    const table = this.ref() as ITgTableBasic
    table.initTable()
  }

  public getTemplateName() {
    return 'TyperListBasic'
  }

  public getMainData() {
    const table = this.ref() as ITgTableBasic
    return table.getSelectedRows()
  }

  public refresh() {
    const table = this.ref() as ITgTableBasic
    table.doSearch()
  }

  public defaultRef() {
    return 'ref-main'
  }
}
</script>
